<template>
  <el-dialog
    title="地区代码筛选："
    :visible.sync="areaCodeVisiblesubmit"
    width="70%"
    :before-close="areaCodeHandleClosesubmit">
    <el-input
      placeholder="输入关键字进行过滤"
      v-model="filterText">
    </el-input>
    <el-tree class="filter-tree"
             :data="treeData"
             node-key="value"
             ref="areaTree"
             highlight-current
             :props="defaultProps"
             :filter-node-method="filterNode"
             @node-click="areaCodeClick">
    </el-tree>
  </el-dialog>
</template>

<script>
  import {getAreaByType} from "@/api/system";
  export default {
    name: "areatree",
    data() {
      return {
        filterText:'',//申报单位过滤
        treeData: [{
          value:'330000000000',
          label:'浙江省'
        }],//申报单位树数据
        treeDataTemp:[],
        firstTreeData:[],//第一级别树
        // 申报单位树参数映射
        defaultProps: {
          children: 'children',
          label: 'label',
        },
      }
    },
    props: {
      areaCodeVisiblesubmit: {
        type: Boolean,
        default: false
      }
    },
    created(){
      this.getOrgCodeList('area_code_city')
    },
    watch: {
      filterText(val) {
        this.$refs.areaTree.filter(val);
      },
      treeDataTemp(val){
        this.treeData = this.treeData.map((v, index) => {
          return {
            value:v.value,
            label:v.label,
            children: this.treeDataTemp
          }
        })
      }
    },
    methods: {
      // 获取申报单位树
      async getOrgCodeList(type) {
        await getAreaByType(Object.assign({
          current: 1,
          size: 200,
          valueLike:33,
          type:type
        })).then(response => {
           this.getDealTree(response.data.data.records)
        })
      },
      async getDealTree(treeList){
        for(var i in treeList){
          var areaCode = treeList[i].value.substring(0,4);
          var value = treeList[i].value;
          var self = this;
          await getAreaByType(Object.assign({
            current: 1,
            size: 200,
            valueLike:areaCode,
            type:"area_code_county",
          })).then(response => {
            treeList[i].children = response.data.data.records;
            self.treeDataTemp.push(treeList[i])
          })
        }
      },
      filterNode(value, data) {
        if (!value) return true;
        return data.label.indexOf(value) !== -1
      },
      //申报单位树点击事件
      areaCodeClick(data){
        this.$emit('areaCodeClick',data)
      },
      // 申报单位树弹框关闭事件
      areaCodeHandleClosesubmit(){
        this.$emit('areaCodeHandleClosesubmit')
      },
    }
  };
</script>

